<template>
  <div class="gbox good-detail spage">
      <myhead :back="true" :title="$route.query.name"></myhead>
      <div class="good-detail-box" v-if="good">
          <van-image :src="good.img" class="good-img" ></van-image>
          <van-cell-group>
              <van-cell title="分类"   :value="good.type.text"  />
              <van-cell title="折扣率(折)"     :value="good.discount" />
              <van-cell  title="单价(元)"   :value="good.price"  />
              <van-cell title="购买数量"   >
                  <template #extra>
                      <van-stepper min="1" max="100" v-model.number="count"></van-stepper>     
                  </template>
              </van-cell>
              <van-cell title="购买总价(元)"  :value="value.toFixed(2)"  />
          </van-cell-group>
          <van-goods-action>
            <van-goods-action-icon icon="chat-o" text="客服" dot />
            <van-goods-action-icon icon="cart-o" text="购物车" @click="gotocart" :badge="cartNum" />
            <van-goods-action-icon icon="shop-o" text="店铺" badge="12"  />
            <van-goods-action-button type="warning" text="加入购物车" @click="addtocart"/>
            <van-goods-action-button type="danger" text="立即购买" @click="paynow" />
          </van-goods-action>
      </div>
  </div>
</template>

<script>
export default {
  data(){
    return {
       good:null,
       count:1
    }
  },
  computed:{
    value(){
      return this.good.price * this.count * this.good.discount / 10
    }
  },
  methods:{
    addtocart(){
        this.checkIsLogin(()=>{
          // who
          // count
          // good 

          // 判断  已经添加  就是数量累计 ++ 
          // 如果没有  就是 直接插入
          this.$ajax.findCart({
            phone:this.userInfo.phone,
            goodId:this.$route.params.goodId
          })
          .then(res=>{
            console.log(res) 
            var data =  res[0]
            if(res.length>0){
                this.$ajax.updateCart(data.id,{
                  count:data.count+this.count 
                })
                .then(res=>{
                  this.$toast("商品再次添加成功")
                  this.getCartList()
                })
            }else{
              this.$ajax.addCart({
                  phone:this.userInfo.phone,
                  goodId:this.$route.params.goodId,
                  count:this.count,
                  good:this.good
              })
              .then(res=>{
                this.$toast("购物车新增成功")
                this.getCartList()
              })
            }
          })
        })
    },
    paynow(){
        this.checkIsLogin(()=>{
          this.$router.push({name:"pay",query:{amount:this.value.toFixed(2)}})
        })
    },
    gotocart(){
        this.checkIsLogin(()=>{
          this.$router.push({name:"cart"})
        })
    },
  },
  mounted(){
    // 获取详情
    this.$ajax.findgoods({
      id:this.$route.params.goodId
    })
    .then(res=>{
      console.log(res)
      this.good = res[0];
    })
  }
}
</script>


<style lang="scss" scoped>
.good-detail{
    height:100%;
    overflow: auto;
    background: #fafafa;
    &-box{
        width:100%;
        height:100%;
        padding:15px;
        .good-img{
            width:100%;
            height:250px;
            
            img{
              border-radius: 20px;
            }
        }
    }
}
</style>